 
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://java.sun.com/jsf/core">

    <ui:composition template="layout.xhtml">
        <ui:define name="title">
            <h2><a href="#" class="back" onclick="history.go(-1)"/>Editar Ficha de Inscrição</h2>
        </ui:define>

        <ui:define name="body">
            
            <link rel='stylesheet prefetch' href='media/css/photoswipe.css'/>
            <link rel='stylesheet prefetch' href='media/css/default-skin.css'/>
            <link rel="stylesheet" href="media/css/style_photo.css" media="screen" type="text/css" />

            <h:form id="form" enctype="multipart/form-data">
                <p:panel styleClass="container_24 clearfix">

                    <p:messages id="messages" closable="true" showDetail="true" autoUpdate="true"/>

                    <p:panel id="dadosGeraisPanel" styleClass="container_24 clearfix">
                        <h2>Participante</h2>
                        <br/>

                        <p:outputLabel value="Tipo:" styleClass="grid_3" for="tipoParticipante"/>
                        <div class="grid_8 select-one-menu">
                            <p:selectOneMenu id="tipoParticipante" panelStyle="width:150px;"
                                             value="#{managerPesquisarFichaInscricao.ficha.tipoParticipante}"
                                             required="true" requiredMessage="O campo Tipo é obrigatório !">
                                <f:selectItem itemLabel="" itemValue="" />
                                <f:selectItems value="#{managerUtilitario.tipoParticipante}"/>
                            </p:selectOneMenu>
                        </div>

                        <p:outputLabel value="Status:" styleClass="grid_3" for="status" rendered="false"/>
                        <div class="grid_8 select-one-menu statusSelectOneMenu">
                            <p:selectOneMenu id="status" panelStyle="width:150px;" rendered="false"
                                             value="#{managerPesquisarFichaInscricao.ficha.status}">
                                <f:selectItem itemLabel="" itemValue="" />
                                <f:selectItems value="#{managerUtilitario.status}"/>
                            </p:selectOneMenu>
                        </div>
                        <div class="clear"/>

                        <p:outputLabel value="Nome:" styleClass="grid_3" for="nomeInputText"/>
                        <p:inputText id="nomeInputText" styleClass="grid_19" value="#{managerPesquisarFichaInscricao.ficha.participante.nome}"
                                     required="true" requiredMessage="O campo Nome é obrigatório !"/>
                        <div class="clear"/>

                        <p:outputLabel value="Fone:" styleClass="grid_3" for="fone"/>
                        <p:inputText id="fone" styleClass="grid_8" value="#{managerPesquisarFichaInscricao.ficha.participante.telefone}"/>

                        <p:outputLabel value="Celular:" styleClass="grid_3" for="celular"/>
                        <p:inputText id="celular" styleClass="grid_8 celularInputText" 
                                     value="#{managerPesquisarFichaInscricao.ficha.participante.celular}"/>
                        <div class="clear"/>

                        <p:outputLabel value="Email:" styleClass="grid_3" for="email"/>
                        <p:inputText id="email" styleClass="grid_19" value="#{managerPesquisarFichaInscricao.ficha.participante.email}"/>
                        <div class="clear"/>

                        <p:outputLabel value="Logradouro:" styleClass="grid_3" for="endereco"/>
                        <p:inputText id="endereco" styleClass="grid_19" 
                                     value="#{managerPesquisarFichaInscricao.ficha.participante.endereco.logradouro}"/>
                        <div class="clear"/>

                        <p:outputLabel value="Número:" styleClass="grid_3" for="numero"/>
                        <p:inputText id="numero" styleClass="grid_5 omega" 
                                     value="#{managerPesquisarFichaInscricao.ficha.participante.endereco.numero}"/>

                        <p:outputLabel value="Bairro:" styleClass="grid_3 alpha" for="bairro"/>
                        <p:inputText id="bairro" styleClass="grid_11 alpha" 
                                     value="#{managerPesquisarFichaInscricao.ficha.participante.endereco.bairro}"/>
                        <div class="clear"/>

                        <p:outputLabel value="Cidade:" styleClass="grid_3" for="cidade"/>
                        <p:inputText id="cidade" styleClass="grid_14 omega" 
                                     value="#{managerPesquisarFichaInscricao.ficha.participante.endereco.cidade}"/>

                        <p:outputLabel value="UF:" styleClass="grid_3 alpha" for="uf"/>
                        <p:inputText id="uf" styleClass="grid_2 alpha" 
                                     value="#{managerPesquisarFichaInscricao.ficha.participante.endereco.uf}"/>
                        <div class="clear"/>

                        <p:outputLabel value="Clube:" styleClass="grid_3" for="clube"/>
                        <p:autoComplete id="clube" styleClass="grid_19" dropdown="true" converter="clubeconverter"
                                        var="clube" itemLabel="#{clube.nome.toString().concat(' - ').concat(clube.estado.sigla)}"
                                        itemValue="#{clube}" value="#{managerPesquisarFichaInscricao.ficha.clube}"
                                        scrollHeight="200" forceSelection="true" required="true" requiredMessage="O campo Clube é obrigatório !"
                                        completeMethod="#{managerUtilitario.autocompleteClube}"/>
                        <div class="clear"/>

                        <p:outputLabel value="Nº do Associado em RI:" styleClass="grid_3 numeroAssociadoRI" for="numeroAssociado"/>
                        <p:inputText id="numeroAssociado" styleClass="grid_4" value="#{managerPesquisarFichaInscricao.ficha.numeroAssociadoEmRI}"/>

                        <p:outputLabel value="Meio de Transporte:" styleClass="grid_6" for="meioTransporte"/>
                        <div class="grid_9 select-one-menu meioTransporteSelectOneMenu">
                            <p:selectOneMenu id="meioTransporte" panelStyle="width:150px;"
                                             value="#{managerPesquisarFichaInscricao.ficha.meioTransporte}">
                                <f:selectItem itemLabel="" itemValue="" />
                                <f:selectItems value="#{managerUtilitario.meioTransporte}"/>
                            </p:selectOneMenu>
                        </div>
                        <div class="clear"/>

                        <p:outputLabel value="Nome crachá:" styleClass="grid_3 nomeCracha" for="nomeCracha"/>
                        <p:inputText id="nomeCracha" styleClass="grid_19" value="#{managerPesquisarFichaInscricao.ficha.nomeCracha}"/>
                        <div class="clear"/>
                        <br/>

                        <h2>Convidado</h2>
                        <br/>

                        <p:outputLabel value="Tipo:" styleClass="grid_3" for="tipoConvidado"/>
                        <div class="grid_8 select-one-menu">
                            <p:selectOneMenu id="tipoConvidado" panelStyle="width:150px;"
                                             value="#{managerPesquisarFichaInscricao.ficha.tipoConvidado}">
                                <f:selectItem itemLabel="" itemValue="" />
                                <f:selectItems value="#{managerUtilitario.tipoConvidado}"/>
                            </p:selectOneMenu>
                        </div>
                        <div class="clear"/>

                        <p:outputLabel value="Nome:" styleClass="grid_3" for="nomeConvidado"/>
                        <p:inputText id="nomeConvidado" styleClass="grid_19" value="#{managerPesquisarFichaInscricao.ficha.convidado.nome}"/>
                        <div class="clear"/>

                        <p:outputLabel value="Fone:" styleClass="grid_3" for="foneConvidado"/>
                        <p:inputText id="foneConvidado" styleClass="grid_8" value="#{managerPesquisarFichaInscricao.ficha.convidado.telefone}"/>

                        <p:outputLabel value="Celular:" styleClass="grid_3" for="celularConvidado"/>
                        <p:inputText id="celularConvidado" styleClass="grid_8 celularInputText" 
                                     value="#{managerPesquisarFichaInscricao.ficha.convidado.celular}"/>
                        <div class="clear"/>

                        <p:outputLabel value="Email:" styleClass="grid_3" for="emailConvidado"/>
                        <p:inputText id="emailConvidado" styleClass="grid_19" value="#{managerPesquisarFichaInscricao.ficha.convidado.email}"/>
                        <div class="clear"/>

                        <p:outputLabel value="Nome crachá:" styleClass="grid_3 nomeCracha" for="nomeCrachaConvidado"/>
                        <p:inputText id="nomeCrachaConvidado" styleClass="grid_19" value="#{managerPesquisarFichaInscricao.ficha.nomeCrachaConvidado}"/>
                        <div class="clear"/><br/>

                        <h2>Anexos</h2>

                        <p:panel id="documentoPanel" styleClass="container_24 clearfix withoutBorder">

                            <p:fileUpload id="fileUpload"   
                                          mode="advanced" label="Anexar"
                                          uploadLabel="Enviar"
                                          cancelLabel="Cancelar"
                                          fileUploadListener="#{managerPesquisarFichaInscricao.adicionarAnexo}"
                                          multiple="false" auto="true"
                                          allowTypes="/(\.|\/)(gif|jpe?g|png)$/"
                                          dragDropSupport="true"
                                          invalidFileMessage="Tipo de arquivo não suportado."
                                          invalidSizeMessage="Tamanho do arquivo não é suportado"
                                          immediate="true" update=":form:documentoPanel"/>

                            <ui:repeat  value="#{managerPesquisarFichaInscricao.ficha.anexos}" var="a">

                                <p:panel styleClass="thumbnail">

                                    <p:commandButton id="removeButton" alt="Remover" styleClass="ui-button-only button-remove btn-danger"
                                                     icon="ui-icon-trash" update=":form:documentoPanel" 
                                                     process=":form:documentoPanel"
                                                     actionListener="#{managerPesquisarFichaInscricao.removerAnexo(a)}" />

                                    <h:outputLink value="#{a.tipo ne 'application/pdf' ? 'viewImage.xhtml':'show'}"
                                                  title="#{a.nomeExibicao}" target="_blank">

                                        <p:graphicImage styleClass="image grid_3 anexoImovel" rendered="#{managerImagem.imagem(a)}"
                                                        url="#{managerImagem.urlThumbnailImagem(a)}" />

                                        <p:graphicImage styleClass="image grid_3 anexoImovel" rendered="#{managerImagem.PDF(a)}" 
                                                        url="#{managerImagem.urlPDF}" />
                                        <div class="clear-both"/>

                                        <p:outputLabel  value="#{managerImagem.nomeAnexo(a)}" 
                                                        style="margin-left:1%; width: 100px;" rendered="#{managerImagem.imagem(a)}"/>

                                        <p:outputLabel  value="#{managerImagem.nomeAnexoPdf(a)}" 
                                                        style="margin-left:1%; width: 100px;" rendered="#{managerImagem.PDF(a)}"/>

                                        <f:param name="annex" value="#{managerImagem.urlVisualizarImagem(a)}"/>
                                    </h:outputLink>

                                </p:panel>
                            </ui:repeat>
                        </p:panel>

                        <h2>Observação</h2>
                        <br/>
                        <p:outputLabel value="Observação:" styleClass="grid_3 nomeCracha" for="obs"/>
                        <p:inputTextarea id="obs" styleClass="grid_19" style="min-width: "
                                         value="#{managerPesquisarFichaInscricao.ficha.obs}"/>

                    </p:panel>
                    <br/>

                    <div class="buttonAction">
                        <p:commandButton value="Salvar" actionListener="#{managerPesquisarFichaInscricao.atualizar()}"
                                         icon="ui-icon-disk" styleClass="ui-priority-primary"
                                         update="@form" onsuccess="goTop(0)"/>
                        <p:button value="Cancelar" icon="ui-icon-circle-close"
                                  href="visualizarfichainscricao.xhtml?ficha=#{managerPesquisarFichaInscricao.ficha.id}" />
                    </div>
                </p:panel>

                <h:inputHidden id="pid" />
            </h:form>

            <div id="divGaleria" class="pswp" tabindex="-1" role="dialog" aria-hidden="true">

                <div class="pswp__bg"></div>

                <div class="pswp__scroll-wrap">

                    <div class="pswp__container">
                        <div class="pswp__item"></div>
                        <div class="pswp__item"></div>
                        <div class="pswp__item"></div>
                    </div>

                    <div class="pswp__ui pswp__ui--hidden">

                        <div class="pswp__top-bar">

                            <div class="pswp__counter"></div>

                            <button class="pswp__button pswp__button--close" title="Fechar (Esc)"></button>
                            <button class="pswp__button pswp__button--fs" title="Tela Cheia"></button>
                            <button class="pswp__button pswp__button--edit" 
                                    title="Editar" onclick="edit();" ></button>
                            <button class="pswp__button pswp__button--zoom" title="Zoom +/-"></button>

                            <div class="pswp__preloader">
                                <div class="pswp__preloader__icn">
                                    <div class="pswp__preloader__cut">
                                        <div class="pswp__preloader__donut"></div>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="pswp__share-modal pswp__share-modal--hidden pswp__single-tap">
                            <div class="pswp__share-tooltip"></div> 
                        </div>



                        <button class="pswp__button pswp__button--arrow--left" title="Anterior (seta esquerda)">
                        </button>

                        <button class="pswp__button pswp__button--arrow--right" title="Próximo (seta direita)">
                        </button>

                        <div class="pswp__caption">
                            <div class="pswp__caption__center"></div>
                        </div>

                    </div>

                </div>

            </div>


            <script src='media/js/photoswipe.min.js'></script>
            <script src='media/js/photoswipe-ui-default.min.js'></script>

            <script src="media/js/index.js"></script>

            <script>
                function edit() {
                    var pid = $('#form\\:pid').val(window.parseItemIndexFromURL().pid);
                    editCommand();
                }
            </script>

        </ui:define>
    </ui:composition>
</html>



